<template>
   <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="24">
          <a-col :md="6" :sm="8">
            <a-form-item label="表名称">
              <a-input placeholder="请输入表名称" v-model="queryParam.fdTableName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="状态">
              <j-dict-select-tag placeholder="请选择状态" v-model="queryParam.fdStatus" dictCode="hadoop_hdflag"/>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>


    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        @change="handleTableChange">
        <!-- 字符串超长截取省略号显示-->
        <span slot="fdWhere" slot-scope="text">
          <j-ellipsis :value="text" :length="9" />
        </span>
        <span slot="action" slot-scope="text, record">
         <a href="javascript:;" @click="handleDetail(record.fdTableId)">详情</a>
          <a-divider type="vertical"/>
          <a-dropdown>
            <a href="javascript:;" @click="showOpersscFiddetail(record.fdTableId,record.fdSscid)">字段展示</a>

          </a-dropdown>
        </span>

      </a-table>
    </div>
    <!-- table区域-end -->
    <operssc-fiddetail-modal ref="opersscFiddetailModal" ></operssc-fiddetail-modal>
     <sys-tableinfo-modal ref="sysTableinfoModal"></sys-tableinfo-modal>

    <!-- 表单区域 -->
    <OpersscTabdetail-modal ref="modalForm" @ok="modalFormOk"/>
  </a-card>
</template>

<script>
  import OpersscTabdetailModal from './modules/OpersscTabdetailModal'
  import {JeecgListMixin} from '@/mixins/JeecgListMixin'
  import {getAction,deleteAction} from '@/api/manage'
  import OpersscFiddetailModal from './modules/OpersscFiddetailModal'
  import JEllipsis from "@/components/jeecg/JEllipsis";
  import SysTableinfoModal from '../../../modules/meta/modules/SysTableinfoModal'

  export default {
    name: "OpersscTabdetailList",
    mixins: [JeecgListMixin],
    components: {
      SysTableinfoModal,
      JEllipsis,
      OpersscFiddetailModal,
      OpersscTabdetailModal,

    },
    data() {
      return {
        description: '信息',
        fdTableId:{},
        fdSscid:{},
        // 表头
        columns: [
       /*   {
            title: '表id',
            align:"center",
            dataIndex: 'fdTableId'
          },*/
          {
            title: '表名称',
            align: 'center',
            dataIndex: 'fdTableId_dictText'
          },
          {
            title: '是否脱敏',
            align:"center",
            dataIndex: 'fdDes_dictText'
          },
          {
            title: '自定义条件',
            align:"center",
            dataIndex: 'fdWhere',
            scopedSlots: {customRender: 'fdWhere'},
          },
          {
            title: '状态',
            align:"center",
            dataIndex: 'fdStatus_dictText'
          },
        /*  {
            title: '是否发布到调度平台',
            align:"center",
            dataIndex: 'fdRelease_dictText'
          },*/

         {
          title: '操作',
          key: 'operation',
          align: "center",
          width: 130,
          scopedSlots: {customRender: 'action'},
        }],
        url: {
          list: "/rule/opersscTpReview/listOpersscTabdetailByMainId",
          delete: "/rule/opersscTpReview/deleteOpersscTabdetail",
          deleteBatch: "/rule/opersscTpReview/deleteBatchOpersscTabdetail",
        }
      }
    },

    methods: {
      loadData(arg) {
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        var params = this.getQueryParams();
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records;
            this.ipagination.total = res.result.total;
          } else {
            this.dataSource = null;
          }
        })
      },
      getMain(fdSscid) {
        this.queryParam.fdSscid = fdSscid;
        this.loadData(1);
      },
      handleAdd: function() {
        if (this.queryParam.fdSscid == undefined) {
          alert('请选择自动脱敏后点击')
        } else {
          this.$refs.addTableinfoModal.edit((this.queryParam.fdSscid))
          this.$refs.addTableinfoModal.title = '添加自动脱敏详情表'
        }
      },
      showOpersscFiddetail(fdTableId, fdSscid) {
        this.$refs.opersscFiddetailModal.edit(fdTableId, fdSscid);
        this.$refs.opersscFiddetailModal.title = "字段展示";
      },
      handleDetail(fdTableId){
        this.$refs.sysTableinfoModal.etails(fdTableId);
        this.$refs.sysTableinfoModal.title = "详情";
        this.$refs.sysTableinfoModal.disableSubmit = true;
      },
      searchQuery: function() {
        this.selectedRowKeys = []
        this.selectionRows = []
        this.loadData()
      },
      searchReset: function() {
        this.queryParam = { fdSscid: this.queryParam.fdSscid };
        this.loadData(1)
      },
      handleDelete: function(record) {
        if (!this.url.delete) {
          this.$message.error("请设置url.delete属性!")
          return
        }
        var that = this;
        var param = { id: record.id, fdSscid: record.fdSscid, fdTableId: record.fdTableId }
        deleteAction(that.url.delete, param).then((res) => {
          if (res.success) {
            that.$message.success(res.message);
            that.loadData();
          } else {
            that.$message.warning(res.message);
          }
        });
      },
      batchDel: function() {
        if (!this.url.deleteBatch) {
          this.$message.error("请设置url.deleteBatch属性!")
          return
        }
        if (this.selectedRowKeys.length <= 0) {
          this.$message.warning('请选择一条记录！');
          return;
        } else {
          var ids = "";
          var fdTableId = "";
           for (var a = 0; a < this.selectionRows.length; a++) {
             ids += this.selectionRows[a]["id"] + ",";
             fdTableId += this.selectionRows[a]["fdTableId"]+",";
          }
          var that = this;
           this.$confirm({
            title: "确认删除",
            content: "是否删除选中数据?",

            onOk: function() {
              var  param = { ids: ids,fdTableId:fdTableId,fdSscid:that.queryParam.fdSscid}
              deleteAction(that.url.deleteBatch, param).then((res) => {
                if (res.success) {
                  that.$message.success(res.message);
                  that.loadData();
                  that.onClearSelected();
                } else {
                  that.$message.warning(res.message);
                }
              });
            }
          });
        }
      },
    }
  }
</script>
<style scoped>
  .ant-card {
    margin-left: -30px;
    margin-right: -30px;
  }
</style>
